<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>成绩查询</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <link rel="stylesheet" href="/ui/assets/css/amazeui.min.css"/>
</head>
<body>
<header data-am-widget="header" class="am-header am-header-default am-header-fixed">
  <h1 class="am-header-title">
    <a href="#title-link" class=""></a>
  </h1>
  <div class="am-header-right am-header-nav">
	<div class="am-dropdown" data-am-dropdown>
	  <button class="am-btn am-btn-primary am-dropdown-toggle" data-am-dropdown-toggle>选择成绩 <span class="am-icon-caret-down"></span></button>
	  <ul class="am-dropdown-content">
        <li class=""><a href="##" onclick="grade()">单科成绩</a></li>
        <li class=""><a href="##" onclick="termGrade()">学期成绩</a></li>
        <li class=""><a href="##" onclick="yearGrade()" >学年成绩</a></li>
        <li class=""><a href="##" onclick="schoolGrade()" >在校成绩</a></li>
	  </ul>
	</div>
  </div>
</header>

<div id="grade">
	
	
</div>


<script type="text/art-template" id="grade-art-template">
<table class="am-table am-table-bordered">
  <thead>
	  <tr class="am-primary">
	    <th>学年</th>
	    <th>学期</th>
	    <th>课程</th>
	    <th>成绩</th>
	  </tr>
  </thead>
  <tbody>
{{each grades.GRADE as grade index}}
	  <tr {{if grade.grade < 60 }} class="am-danger" {{/if}} >
	    <td>{{grade.schoolYear}}</td>
	    <td>{{grade.schoolTerm}}</td>
	    <td>{{grade.course}}</td>
	    <td>{{grade.grade}}</td>
	  </tr>
{{/each}}
  </tbody>
</table>
</script>
<script type="text/art-template" id="termGrade-art-template">
<table class="am-table am-table-bordered">
  <thead>
	  <tr class="am-primary">
	    <th>学年</th>
	    <th>学期</th>
	    <th>平均记点分</th>
	  </tr>
  </thead>
  <tbody>
{{each grades.SCHOOLTERMGRADE as grade index}}
	  <tr {{if grade.grade < 60 }} class="am-danger" {{/if}} >
	    <td>{{grade.schoolYear}}</td>
	    <td>{{grade.schoolTerm}}</td>
	    <td>{{grade.grade}}</td>
	  </tr>
{{/each}}
  </tbody>
</table>
</script>

<script type="text/art-template" id="yearGrade-art-template">
<table class="am-table am-table-bordered">
  <thead>
	  <tr class="am-primary">
	    <th>学年</th>
	    <th>平均记点分</th>
	  </tr>
  </thead>
  <tbody>
{{each grades.SCHOOLYEARGRADE as grade index}}
	  <tr {{if grade.grade < 60 }} class="am-danger" {{/if}} >
	    <td>{{grade.schoolYear}}</td>
	    <td>{{grade.grade}}</td>
	  </tr>
{{/each}}
  </tbody>
</table>
</script>

<script type="text/art-template" id="schoolGrade-art-template">
<table class="am-table am-table-bordered">
  <thead>
	  <tr class="am-primary">
	    <th>成绩</th>
		<th>学分</th>
	    <th>课程</th>
		<th>通过</th>
		<th>未过</th>
	  </tr>
  </thead>
  <tbody>
	  <tr {{if grades.SCHOOLGRADE.grade < 60 }} class="am-danger" {{/if}} >
	    <td>{{grades.SCHOOLGRADE.grade}}</td>
		<td>{{grades.SCHOOLGRADE.credit}}</td>
	    <td>{{grades.SCHOOLGRADE.total}}</td>
		<td>{{grades.SCHOOLGRADE.pass}}</td>
		<td>{{grades.SCHOOLGRADE.unpass}}</td>
	  </tr>
  </tbody>
</table>
</script>

<div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default "  id="navbar">
    <ul id="menus" class="am-navbar-nav am-cf am-avg-sm-3">
    
        <li>
            <a href="/home.html">
            	<span class="am-icon-home"></span>
                <span class="am-navbar-label">首页</span>
            </a>
        </li>
        <li>
            <a href="/grade.html">
            	<span class="am-icon-book"></span>
                <span class="am-navbar-label">成绩</span>
            </a>
        </li>
        <li>
            <a href="/course.html">
            	<span class="am-icon-list"></span>
                <span class="am-navbar-label">课表</span>
            </a>
        </li>
    </ul>
</div>

<div class="am-modal am-modal-loading am-modal-no-btn" tabindex="-1" id="loading">
  <div class="am-modal-dialog">
    <div id="modal-loading-msg" class="am-modal-hd">加载中...，高峰时期可能会失败，请多试几次。</div>
    <div class="am-modal-bd">
      <span class="am-icon-spinner am-icon-spin"></span>
    </div>
  </div>
</div>

<div class="am-modal am-modal-confirm" tabindex="-1" id="alert">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">提示</div>
    <div class="am-modal-bd" id="alert-msg">
    	获取失败。
    </div>
    <div class="am-modal-footer">
      <span class="am-modal-btn" data-am-modal-cancel>取消</span>
      <span class="am-modal-btn" data-am-modal-confirm>确定</span>
    </div>
  </div>
</div>


</body>
<script src="/ui/assets/js/jquery.min.js"></script>
<script src="/ui/assets/js/amazeui.min.js"></script>
<script src="/template.js"></script>
<script type="text/javascript">
	var data = {};
    
	$(function(){
		$.ajax({
			url:'/doGrade',
			data:{},
			dataType:'json',
			type:'POST',
			success:function(_data_){
				if(_data_.err != "0"){
					$("#alert").modal();
				}
				else{
					data['grades'] = _data_['grades'];
					grade();
				}
			},
			error:function(e){
				$("#alert").modal();
			},
			beforeSend:function(){
				$("#loading").modal();
			},
			complete:function(){
				$("#loading").modal("close");
			}
		});
	});
	
    
    /**
    * 单科成绩
    */
    function grade(){
        $('#grade').html(template('grade-art-template', data));
    }
    /**
    * 学期成绩
    */
    function termGrade(){
    	$('#grade').html(template('termGrade-art-template', data));
    }
    /**
    * 学年成绩
    */
    function yearGrade(){
    	$('#grade').html(template('yearGrade-art-template', data));
    }
    /**
    * 在校成绩
    */
    function schoolGrade(){
    	$('#grade').html(template('schoolGrade-art-template', data));
    }
    
</script>


</html>